import React, { Component } from 'react'
import TwsLayout from './component/tws-layout/index'
import { connect } from 'react-redux'

import { HashRouter as Router, Route } from 'react-router-dom'
import HomePageBody from './component/home-page-body'
import SerialPageBody from './component/more-serials-body'
import SerialDetailPage from './component/serial-detail-page'
import VideoPageBody from './component/more-videos-body'
import VideoDetailPage from './component/video-detail-page'
import MySubscriptionBody from './component/my-subscription/my-subscription-body'
import MyApplicationBody from './component/my-subscription/my-application-body'
import SerialsManagementBody from './component/management/serial/serials-management-body'
import VideosManagementBody from './component/management/video/videos-management-body'
import ApplicationsManagementBody from './component/management/application/applications-management-body'
import NewSerialBody from './component/management/serial/new-serial-body'
import NewVideoBody from './component/management/video/new-video-body'
import EditorVideoBody from './component/management/video/edit-video-body'
import EditSerialBody from './component/management/serial/edit-serial-body'
import PreviewSerialBody from './component/management/serial/preview-serial-body';
import PublisherManagementBody from './component/publisher-management-body';

import 'react-dropzone-uploader/dist/styles.css'
import './less/react-upload-style-override.css'
class App extends Component {
  render () {
    return (
      <Router>
        <TwsLayout>
          <div>
              <Route exact path='' component={HomePageBody} />
            <Route exact path='/my-subscriptions' component={MySubscriptionBody} />
            <Route exact path='/my-applications' component={MyApplicationBody} />
            <Route exact path='/serials' component={SerialPageBody} />
            <Route exact path='/serials/:serialId' component={SerialDetailPage} />
            <Route exact path='/serials-management/serials/new' component={NewSerialBody} />
            <Route exact path='/serials-management/serials/:serialId/edit' component={EditSerialBody} />
            <Route exact path='/serials-management/serials/:serialId/preview' component={PreviewSerialBody} />

            <Route exact path='/videos' component={VideoPageBody} />
            <Route exact path='/videos/:videoId' component={VideoDetailPage} />
            <Route exact path='/serials-management/videos/new' component={NewVideoBody} />
            <Route exact path='/serials-management/videos/:videoId/editor' component={EditorVideoBody} />
            <Route exact path='/serials-management/videos/:videoId/preview' component={HomePageBody} />

            <Route exact path='/publisher-management' component={PublisherManagementBody} />

            <Route exact path='/serials-management' component={SerialsManagementBody} />
            <Route exact path='/videos-management' component={VideosManagementBody} />
            <Route exact path='/applications-management' component={ApplicationsManagementBody} />

          </div>
        </TwsLayout>
      </Router>
    )
  }
}

const mapStateToProps = ({lang}) => ({lang})

export default connect(mapStateToProps)(App)
